@@include('./tpl/header.html',{"title":"首页"})
@@include('./tpl/menu.html',{"name":"index"})

<div class="swiper-container-parent">
    <div class="pure-content">
        <div class="swiper-container" style="position: relative">
            <div class="padding wt-login-transparent " id="wt-login-div">

                <div class="wt-userinfo-con text-center padding-top" style="display: none;">
                    <div class="wt-header wt-header-boy center" style="width:100px;height:100px"></div>
                    <div class="wt-login-username text-xl margin-top-xs"></div>
                    <div class="wt-login-mobile text-lg margin-top-xs margin-bottom-xl"></div>
                    <a href="./user.html" style="width: 100%" class="pure-button pure-button-xl pure-button-primary margin-top-xs">个人中心</a>
                </div>
                <div class="wt-login-con">
                    <div class="text-xl padding-bottom-sm">请登录</div>
                    <form class="pure-form margin-bottom-0 wt-login-form">
                        <div class="padding-bottom-sm">
                            <input name="webAccount" class="pure-input-1 pure-input-lg" placeholder="输入用户名">
                        </div>
                        <div class="padding-bottom-sm">
                            <input type="password" name="webPassword" class="pure-input-1 pure-input-lg" placeholder="请输入密码">
                        </div>
                        <div class="pure-g">
                            <div class="pure-u-7-12">
                                <input name="loginCaptcha" class="pure-input-1 pure-input-lg" minlength="4" maxlength="4"
                                       placeholder="请输入验证码">
                            </div>
                            <div class="pure-u-5-12 text-right padding-left-xs">
                                <img src="/login/api/captchaImage/144/31/loginCaptchaImage/0?v=00000000"
                                     class="pure-img fr wt-captcha-img cur"
                                     style="background:#eee;width:100%;height:42px;">
                            </div>
                        </div>

                    <div class="text-center text-sm wt-login-error"></div>
                    <input type="submit" style="width: 100%" class="pure-button pure-button-xl pure-button-primary wt-login-btn" value="登录">
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="">
    <div class=" wt-bgw margin-top-xs">
        <div class="pure-content pure-g wt-bge">
            <div class="pure-u-2-24 text-primary wt-notify-title">
                <i class="iconfont icon-gonggao padding-left-sm text-lg">&nbsp;</i>
                <span class="strong"> 公告 :</span>
            </div>
            <div class="pure-u-22-24 " id="wt-notify-div"></div>
        </div>
    </div>

    <div class="pure-content padding-bottom-lg padding-top-xs">
        <div class=" wt-home-title margin-top-sm text-xxxl text-primary pure-g">
            <div class="pure-u-5-24">个人贷款</div>
            <div class="pure-u-19-24" style="border:1px solid #e8eff4;position: relative;height:58px;">
                <div class="wt-pbp-star wt-icon1"></div>
                <div class="text-333 text-default padding-left-lg wt-pp-nav-div"></div>
            </div>
        </div>

        <div class="pure-g margin-top wt-pp-div"></div>

        <div class=" wt-home-title margin-top-lg text-xxxl text-primary pure-g">
            <div class="pure-u-5-24">企业贷款</div>
            <div class="pure-u-19-24" style="border:1px solid #e8eff4;position: relative;height:58px;">
                <div class="wt-pbp-star wt-icon2"></div>
                <div class="text-333 text-default padding-left-lg wt-bp-nav-div"></div>
            </div>
        </div>

        <div class="pure-g margin-vertical wt-bp-div hidden"></div>

        <div id="wt-anqr" class="pure-content pure-g padding-bottom">
            <div class="pure-u-1-4 wt-about wt-bgw padding-horizontal-lg cf"></div>
            <div class="pure-u-1-4 wt-news wt-bgw  padding-horizontal-lg cf"></div>
            <div class="pure-u-1-4 wt-qas  wt-bgw  padding-horizontal-lg cf"></div>
            <div class="pure-u-1-4 wt-readme wt-bgw  padding-horizontal-lg cf"></div>
        </div>
    </div>
    <div class="pure-content wt-bgw">
        <div class="pure-content">
            <div class="text-center padding-top-sm padding-bottom-sm strong text-lg text-666">
                合作伙伴
            </div>
            <div class="pure-g wt-links padding-vertical-xl wt-partner-div"
                 style="border-top:1px solid #b5b5b5;">
            </div>
        </div>
    </div>
    @@include('./tpl/commonjs.html')
    <script>
        $(function () {
            var bannertpl = [
                '<div class="swiper-wrapper">',
                '{@each banners as  banner}',
                '<div class="swiper-slide wt-go {@if banner.url != \'\'}cur {@/if}" data-url="${banner.url}" data-bg="${banner.color}" title="${banner.title}" style="background: url(${banner.img}) #ddd;"></div>',
                '{@/each}',
                '</div>',
                '<div class="pagination"></div>'
            ].join("");

            var notifytpl = [
                '<ul id="wt-notify" class="wt-notify text-666 margin-top-xs">',
                '{@each notices as n,k}',
                 '<li class="padding-sm wt-go text-666" data-url="${n.url}"><div style="width:1100px" class="text-truncate text-right">${n.title}</div></li>',
                '{@/each}',
                '</ul>'
            ].join("")

            var prodtpl = [
                '<div class="pure-u-1-3" style="padding{@if index==0}-right:10px{@else if index == 1}:0 5px{@else}-left:10px{@/if};">',
                '<div style="position: relative" class="wt-bt-con cur">',
                '<img src="../../imgs/blank.gif" data-echo="${item.img}" class="wt-bp-img pure-img">',
                '<div class="wt-bp ">',
                '<div class="padding-left padding-top-sm text-xl">${item.title}</div>',
                '<div class="padding-left text-sm padding-top-xs wt-apply-cond">$${item.loan_money}</div>',
                '</div>',
                '<div class="wt-bt-btn-p wt-bp wt-bp-img wt-transparent hidden">',
                '<input type="button" class="pure-button pure-button-primary wt-bp-btn wt-prod-href"  data-prodid="${item.id}" value="查看详情">',
                '</div>',
                '</div>',
                '</div>',
            ].join("");

            var prodnavtpl = '<a href="JavaScript:;" class="padding-horizontal text-333 wt-prod-href"  data-prodid="${item.id}" style="border-right:1px solid #666;">${item.title}</a>';

            var pprodnavtpl = [
                '{@each pproducts as item,index}',
                prodnavtpl,
                '{@/each}',
                '<a href="./products.html" class="padding-left text-333 padding-right-xl">查看所有>></a>'
            ].join("")

            var pprodtpl = [
                '{@each pproducts as item,index}',
                prodtpl,
                '{@/each}',
            ].join("");

            var bprodnavtpl = [
                '{@each bproducts as item,index}',
                prodnavtpl,
                '{@/each}',
                '<a href="./products.html?type=11" class="padding-left text-333 padding-right-xl">查看所有>></a>'
            ].join("")

            var bprodtpl = [
                '{@each bproducts as item,index}',
                prodtpl,
                '{@/each}',
            ].join("");

            var abouttpl = [
                '<div class=" wt-home-title text-xl">${about.title}</div>',
                '<div class="margin-bottom-xs text-center">',
                '<img src="../../imgs/blank.gif" data-echo="${about.img}" style="height:130px;width:251px;" class="center pure-img">',
                '</div>',
                '<div class="text-sm line-clamp7 text-666" style="height:155px;">$${about.desc}</div>',
                '<div class="cf margin-vertical-xs"><a class="fr text-primary text-sm" target="_blank"  href="./about.html?aboutid=${about.id}">查看更多>></a>',
                '</div>'
            ].join("");

            var newtpl = [
                '<div class=" wt-home-title text-xl">新闻消息</div>',
                '<div class="margin-bottom-xs text-center">',
                '<img src="../../imgs/blank.gif" data-echo="${news.img}" style="height:130px;width:251px;" class="center pure-img">',
                '</div>',
                '<ul class="wt-notify wt-ul wt-ul-noline padding-horizontal-lg text-666" style="height:155px;">',
                '{@each news.list as item,index}',
                '{@if index <5}',
                '<li class="text-sm wt-news-href" data-newsid="${item.id}">',
                '<i class="iconfont icon-dian-copy-copy text-999 padding-right-xs text-ccc text-xl" ></i>${item.title}',
                '</li>',
                '{@/if}',
                '{@/each}',
                '</ul>',
                '<div class="cf margin-vertical-xs"><a class="fr text-primary text-sm" target="_blank"  href="./newslist.html">查看更多>></a></div>',
            ].join("");

            var qatpl = [
                '<div class=" wt-home-title text-xl">常见问题</div>',
                '<div class="margin-bottom-xs text-center">',
                '<img src="../../imgs/blank.gif" data-echo="${qa.img}" style="height:130px;width:251px;" class="center pure-img">',
                '</div>',
                '<ul class="wt-notify wt-ul wt-ul-noline padding-horizontal-lg text-666" style="height:155px;">',
                '{@each qa.list as item,index}',
                '{@if index <5}',
                '<li class=" text-sm  wt-qa-href" data-qaid="${item.id}">',
                '<i class="iconfont icon-dian-copy-copy text-999 padding-right-xs text-ccc text-xl " ></i>${item.title}',
                '</li>',
                '{@/if}',
                '{@/each}',
                '</ul>',
                '<div class="cf margin-vertical-xs"><a class="fr text-primary text-sm" target="_blank"  href="./qalist.html">查看更多>></a></div>',
            ].join("");

            var readmetpl = [
                '<div class=" wt-home-title text-xl">新手必读</div>',
                '<div class="margin-bottom-xs text-center">',
                '<img src="../../imgs/blank.gif" data-echo="${readme.img}" style="height:130px;width:251px;" class="center pure-img">',
                '</div>',
                '<ul class="wt-notify wt-ul wt-ul-noline padding-horizontal-lg text-666" style="height:155px;">',
                '{@each readme.list as item,index}',
                '{@if index <5}',
                '<li class=" text-sm wt-readme-href" data-readmeid="${item.id}">',
                '<i class="iconfont icon-dian-copy-copy text-999 padding-right-xs text-ccc text-xl " ></i>${item.title}',
                '</li>',
                '{@/if}',
                '{@/each}',
                '</ul>',
                '<div class="cf margin-vertical-xs"><a class="fr text-primary text-sm" target="_blank"  href="./readmelist.html">查看更多>></a></div>',
            ].join("");

            var partnertpl = [
                '{@each partners as item,index}',
                '{@if index <8}',
                '<div class="pure-u-1-8  text-center">',
                '<a href="${item.url}" target="_blank" class="text-666" style="line-height: 32px;">',
                '<i style="height:32px;width:32px;background:url(${item.icon}?x-oss-process=image/resize,w_32,h_32) #ddd no-repeat;display: inline-block" class="margin-right-xs">&nbsp;</i>${item.title}</a>',
                '</div>',
                '{@/if}',
                '{@/each}',
            ].join("");

            var renderHtml = function (indexjson) {

                $("#wt-login-div").before(juicer(bannertpl, indexjson));
                var banner = new Swiper('.swiper-container', {
                    autoplay: 4000,
                    loop: true,
                    speed: 2000,
                    pagination: '.pagination',
                    paginationClickable: true,
                    onFirstInit: function (swiper) {
                        var bg = swiper.slides[1].data('bg');
                        $(".swiper-container-parent").css({
                            'background': bg
                        });
                    },
                    onSlideChangeStart: function (swiper) {
                        var bg = swiper.slides[banner.activeIndex].data('bg');
                        $('.swiper-container-parent').animate({backgroundColor: bg}, 2000);

                    },
                });


                if (indexjson.banners.length == 1) {
                    $(".pagination").hide();
                    banner.stopAutoplay();
                }


                $("#wt-notify-div").html(juicer(notifytpl, indexjson));
                $("#wt-notify").webTicker({
                    height: '48px',
                    startEmpty: false,
                    duplicate:true,
                    hoverpause: true,
                });
                $(".wt-pp-nav-div").html(juicer(pprodnavtpl, indexjson));
                $(".wt-pp-div").html(juicer(pprodtpl, indexjson));
                $(".wt-bp-nav-div").html(juicer(bprodnavtpl, indexjson));
                $(".wt-bp-div").html(juicer(bprodtpl, indexjson)).removeClass("hidden");
                $(".wt-about").html(juicer(abouttpl, indexjson));

                $(".wt-news").html(juicer(newtpl, indexjson));
                $(".wt-qas").html(juicer(qatpl, indexjson));
                $(".wt-readme").html(juicer(readmetpl, indexjson));

                $(".wt-partner-div").html(juicer(partnertpl, indexjson.footerinfo));

            };

            renderHtml(indexjson);
        })

    </script>
    @@include('./tpl/footer.html')